This repository has no description
1.7 kB
58 lines
1import type { Metadata } from 'next';
2import Header from '@/components/navigation/header/Header';
3import ProfileHeader from '@/features/profile/components/profileHeader/ProfileHeader';
4import ProfileTabs from '@/features/profile/components/profileTabs/ProfileTabs';
5import { Box, Container } from '@mantine/core';
6import { Fragment, Suspense } from 'react';
7import { ApiClient } from '@/api-client/ApiClient';
8import { createClientTokenManager } from '@/services/auth';
9import ProfileHeaderSkeleton from '@/features/profile/components/profileHeader/Skeleton.ProfileHeader';
10
11interface Props {
12 params: Promise<{ handle: string }>;
13 children: React.ReactNode;
14}
15
16export async function generateMetadata({ params }: Props): Promise<Metadata> {
17 const { handle } = await params;
18
19 const apiClient = new ApiClient(
20 process.env.NEXT_PUBLIC_API_BASE_URL || 'http://localhost:3000',
21 createClientTokenManager(),
22 );
23
24 const profile = await apiClient.getProfile({
25 identifier: handle,
26 });
27
28 return {
29 title: profile.name,
30 description:
31 profile.description ?? `Explore ${profile.name}'s profile on Semble`,
32 };
33}
34
35export default async function Layout(props: Props) {
36 const { handle } = await props.params;
37
38 return (
39 <Fragment>
40 <Header />
41 <Suspense fallback={<ProfileHeaderSkeleton />} key={handle}>
42 <ProfileHeader handle={handle} />
43 </Suspense>
44 <Box
45 style={{
46 position: 'sticky',
47 top: 59,
48 zIndex: 1,
49 }}
50 >
51 <Container bg={'white'} px={'xs'} mt={'md'} size={'xl'}>
52 <ProfileTabs handle={handle} />
53 </Container>
54 </Box>
55 {props.children}
56 </Fragment>
57 );
58}